/* ================
		间距
================ */
.com-spacing {
  padding: $com-spacing-col-base $com-spacing-row-base;
}

$spacing-list: (
  'xs': $com-spacing-col-base * 0.5,
  'sm': $com-spacing-col-base * 0.75,
  'md': $com-spacing-col-base,
  'lg': $com-spacing-col-base * 1.25,
  'xl': $com-spacing-col-base * 1.5,
  'xxl': $com-spacing-col-base * 2,
);

@each $key, $val in $spacing-list {
  .com-m-#{$key} {
    margin: $val !important;
  }

  .com-p-#{$key} {
    padding: $val !important;
  }

  .com-mx-#{$key} {
    margin-left: $val !important;
    margin-right: $val !important;
  }

  .com-my-#{$key} {
    margin-top: $val !important;
    margin-bottom: $val !important;
  }

  .com-px-#{$key} {
    padding-left: $val !important;
    padding-right: $val !important;
  }

  .com-py-#{$key} {
    padding-top: $val !important;
    padding-bottom: $val !important;
  }

  @each $short, $long in l left, t top, r right, b bottom {
    .com-m#{$short}-#{$key} {
      margin-#{$long}: $val !important;
    }

    .com-p#{$short}-#{$key} {
      padding-#{$long}: $val !important;
    }
  }
}

@for $i from 0 through 100 {
  .com-p-#{$i} {
    padding: unit($i);
  }

  .com-px-#{$i} {
    padding-left: unit($i);
    padding-right: unit($i);
  }

  .com-py-#{$i} {
    padding-top: unit($i);
    padding-bottom: unit($i);
  }

  .com-pt-#{$i} {
    padding-top: unit($i);
  }

  .com-pr-#{$i} {
    padding-right: unit($i);
  }

  .com-pb-#{$i} {
    padding-bottom: unit($i);
  }

  .com-pl-#{$i} {
    padding-left: unit($i);
  }

  .com-m-#{$i} {
    margin: unit($i);
  }

  .com-mx-#{$i} {
    margin-left: unit($i);
    margin-right: unit($i);
  }

  .com-my-#{$i} {
    margin-top: unit($i);
    margin-bottom: unit($i);
  }

  .com-mt-#{$i} {
    margin-top: unit($i);
  }

  .com-mr-#{$i} {
    margin-right: unit($i);
  }

  .com-mb-#{$i} {
    margin-bottom: unit($i);
  }

  .com-ml-#{$i} {
    margin-left: unit($i);
  }
}

.com-w-full {
  width: 100%;
}

.com-h-full {
  height: 100%;
}

@for $i from 0 through 750 {
  .com-w-#{$i} {
    width: unit($i);
  }

  .com-h-#{$i} {
    height: unit($i);
  }
}
